import { message, Table, Input, Button, Popconfirm, Form, Select, Row, Col } from 'antd';
import { updateCityCustomerServiceConfig } from '@/services/city';

const formItemLayout = {
  labelCol: { span: 14 },
  wrapperCol: { span: 10 },
};
class Customer extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      securityCustomerService: '',
      fundCustomerService: ''
    }
  }
  componentWillReceiveProps(nextProps) {
    if (nextProps.sourcesdata && this.state.securityCustomerService === '') {
      this.setState({
        securityCustomerService: nextProps.sourcesdata.securityCustomerService,
        fundCustomerService: nextProps.sourcesdata.fundCustomerService
      })
    }
  }
  handleCurrencyChange(value, name) {
    this.setState({
      [name]: value
    })
  }
  async handleSave() {
    const { securityCustomerService, fundCustomerService } = this.state;
    const { cityCode } = this.props;
    const responseData = await updateCityCustomerServiceConfig({ cityCode, securityCustomerService, fundCustomerService });
    if (responseData && responseData.code === '000000') {
      message.success('操作成功');
    } else {
      alert(responseData.message)
    }
  }
  render() {
    const { securityCustomerService, fundCustomerService, sourcesData } = this.state;
    const optionData = [{ name: '开启', value: '1' }, { name: '关闭', value: '0' }];
    return (
      <>
        <Row>
          <Col span={6}>
            <Form.Item label="社保客服是否开启" {...formItemLayout}>
              <Select value={String(securityCustomerService)} style={{ width: 120 }} name='securityCustomerService' onChange={(e) => this.handleCurrencyChange(e, 'securityCustomerService')}>
                {optionData.map(function name(params, index) {
                  return (<Option key={params.value} value={params.value}>{params.name}</Option>)
                })}
              </Select>
            </Form.Item>
          </Col>
          <Col span={18}>
            <Form.Item label="公积金客服是否开启" {...formItemLayout}>
              <Select value={String(fundCustomerService)} style={{ width: 120 }}
                name='fundCustomerService' onChange={(e) => this.handleCurrencyChange(e, 'fundCustomerService')}>
                {optionData.map(function name(params, index) {
                  return (<Option key={params.value} value={params.value}>{params.name}</Option>)
                })}
              </Select>
            </Form.Item>
          </Col>
        </Row>
        <div align="center">
          <Button onClick={this.handleSave.bind(this)} type="primary">
            保存
          </Button>
        </div>
      </>
    );
  }
}
export default Customer;
